import React, { Component } from 'react'

export default function InputRef(props) {
  // const inputRef = React.useRef(null)
  const Aref = React.useRef()
  // const Bref = React.useRef()
    // const inputR = e=>{
    //    console.log('',e)
    // }
    return (
      <>
      <input ref={(e)=>{
        console.log('',e)
      }} type='text'/>
      <B />
      <A ref={Aref}/>
      <button onClick={
        ()=>{
          // this.refs.inputRef.focus()
          console.log(Aref)
          // console.log(Bref)
          // console.log(inputRef.current.focus())
        }
      }>聚焦</button>
      </>
    )
 
}


export class A extends Component{
  render(){
    return <div>A</div>
  }
}

export function B (){
  return (
    <div>B</div>
  )
    
  
}